import * as echarts from 'echarts'
import {
  saveCkgnjc,
  connectCkgnjc,
  startCkgnjc,
  stopPort
} from '@/api/login'
import {
  connect,
  connectCancel,
  zhuanTaiShiNeng,
  zhuanTaiShiNengCancel,
  runZhuanTai
} from '@/api/zhuantai'
export default {
  data() {
    return {
      eachartsData: [],
      form: {
        ckh: '',
        btl: '',
        nhsn: [],
        whsn: [],
        whsn_gzms: '21', // 外环使能默认
        whsn_jd: 0, // 外环角度
        whsn_sd: 10, // 外环速度
        nhsn_gzms: '11', // 内环使能默认
        nhsn_jd: 0, // 内环角度
        nhsn_sd: 10, // 内环速度
        whsn_zdjl: true, // 外环使能最短距离
        nhsn_zdjl: true // 内环使能最短距离
      },
      formNhsn: [],
      formWhsn: [],
      formRules: {
        ckh: [
          {
            required: true,
            message: '请选择串口号',
            trigger: 'change'
          }
        ],
        btl: [
          {
            required: true,
            message: '请选择波特率',
            trigger: 'change'
          }
        ]
      },
      // 串口参数
      ckOptions: [
        {
          value: 'COM1',
          label: 'COM1'
        },
        {
          value: 'COM2',
          label: 'COM2'
        },
        {
          value: 'COM3',
          label: 'COM3'
        },
        {
          value: 'COM4',
          label: 'COM4'
        },
        {
          value: 'COM5',
          label: 'COM5'
        },
        {
          value: 'COM6',
          label: 'COM6'
        },
        {
          value: 'COM7',
          label: 'COM7'
        },
        {
          value: 'COM8',
          label: 'COM8'
        },
        {
          value: 'COM9',
          label: 'COM9'
        },
        {
          value: 'COM10',
          label: 'COM10'
        }
      ],
      // 波特率
      btlOptions: [
        {
          value: '9600',
          label: '9600'
        },
        {
          value: '19200',
          label: '19200'
        },
        {
          value: '38400',
          label: '38400'
        },
        {
          value: '115200',
          label: '115200'
        }
      ],
      // 内环参数
      nhOptions: [
        {
          value: '11',
          label: '绝对位置'
        },
        {
          value: '12',
          label: '相对位置'
        },
        {
          value: '1E',
          label: '使能'
        },
        {
          value: '1F',
          label: '停车'
        }
      ],
      // 外环参数
      whOptions: [
        {
          value: '21',
          label: '绝对位置'
        },
        {
          value: '22',
          label: '相对位置'
        },
        {
          value: '2E',
          label: '使能'
        },
        {
          value: '2F',
          label: '停车'
        }
      ],
      setTimeForm: {
        Time: 2
      }, // 设置时间间隔
      setTimeRules: {
        Time: [
          {
            required: true,
            message: '请输入时间间隔',
            trigger: 'blur'
          }
        ]
      },
      isStartTime: false, // 是否开始保存数据并启动计时
      timeInterval: 0, // 倒计时
      isStartTimeQ1: false, // 是否开始保存数据并启动计时
      timeIntervalQ1: 0, // 倒计时
      zdtp: '',
      zdqbz: '',
      zdqjs: '',
      // 通讯按钮文字
      connectName: '通 讯',
      // 通讯按钮状态
      connectState: false,
      // 双轴转台信息对象Obj
      zhuanTaiObj: {},
      // 内环使能Checked
      nhsnChecked: false,
      // 外环使能Checked
      whsnChecked: false,
      // 内环使能
      checkedNh: false,
      // 外环使能
      checkedWh: false,
      // 倾角差X轴
      qingJiaoChaXArr: [],
      // 倾角差Y轴
      qingJiaoChaYArr: [],
      // 夹角差
      jiaJiaoChaArr: [],
      // 折线图X轴数组
      numArr: [],
      // 折线图X轴起始0
      numx: 0,
      // 保存数据右下角八个参数
      saveZhuanTaiList: [],
      //  保存数据右下角八个参数Excel表头
      json_fields: {
        时间: 'nowData',
        内环角度: 'x',
        外环角度: 'y',
        Q1x: 'q1x',
        Q2x: 'q2x',
        Q1y: 'q1y',
        Q2y: 'q2y',
        Q1角度: 'q1JiaJiao',
        Q2角度: 'q2JiaJiao'
      },
      //  保存数据右下角八个参数Excel标题
      header: '调平平台数据表',
      // Excel名称
      downLoadExcelName: `调平平台数据信息${this.getNowDate(1)}.xls`,
      // 保存数据右下角八个参数
      saveQ1List: [],
      //  保存数据右下角八个参数Excel表头
      json_fields_q1: {
        时间: 'nowData',
        Q1x: 'q1x',
        Q1y: 'q1y'
      },
      //  保存数据右下角八个参数Excel标题
      headerQ1: '数据表',
      // Excel名称
      downLoadExcelNameQ1: `q1xy数据信息${this.getNowDate(1)}.xls`,
      // 保存Q1时间数组
      saveQ1Time: [],
      // 保存双轴转台参数时间数组
      saveZhuanTaiTime: []
    }
  },
  created() {
    // this.initEcharts()
    this.$socket.registerCallBack(this.zhuanTaiScoketConnect)
  },
  mounted() {
    // this.initEcharts()
  },
  methods: {
    /**
     * 接收Socket
     * @param {*} receiveSocketData
     */
    zhuanTaiScoketConnect(receiveSocketData) {
      let data = JSON.parse(receiveSocketData.data)
      if (data.msgType === 'SZ_ZT') {
        let obj = JSON.parse(data.msg)
        this.zhuanTaiObj = {
          ...obj
        }
        // 判断内环使能checkBox是否选中状态并且赋值
        if (obj.nhsn === 1) {
          this.checkedNh = true
        } else {
          this.checkedNh = false
        }
        // 判断外环使能checkBox是否选中状态并且赋值
        if (obj.whsn === 1) {
          this.checkedWh = true
        } else {
          this.checkedWh = false
        }
        this.huoQuShuJu(obj)
        // 根据接收到的Socket数据来组装折线图中的数据
        // 组装折线图X轴数据：判断数组长度大于40后清空数据重新组装
        setTimeout(this.shujuJieShou(obj), 2000)
      }
    },
    shujuJieShou(obj) {
      if (this.numArr.length === 40) {
        this.numArr = []
      } else {
        this.numArr.push(this.numx++)
      }
      // 组装折线图夹角差数据：判断数组长度大于40后清空数据重新组装
      if (this.jiaJiaoChaArr.length === 200) {
        this.jiaJiaoChaArr = []
      } else {
        this.jiaJiaoChaArr.push(obj.jiaJiaoCha)
      }
      // 组装折线图倾角差X轴数据：判断数组长度大于40后清空数据重新组装
      if (this.qingJiaoChaXArr.length === 200) {
        this.qingJiaoChaXArr = []
      } else {
        this.qingJiaoChaXArr.push(obj.q1Cha)
      }
      // 组装折线图倾角差Y轴数据：判断数组长度大于40后清空数据重新组装
      if (this.qingJiaoChaYArr.length === 200) {
        this.qingJiaoChaYArr = []
      } else {
        this.qingJiaoChaYArr.push(obj.q2Cha)
        localStorage.setItem('qingJiaoChaYArr', this.qingJiaoChaYArr)
      }
      this.initEcharts()
    },
    /**
     * 内环使能事件
     */
    nhsnClick() {
      if (!this.form.ckh || !this.form.btl) {
        return this.$message.warning('请选择串口号、波特率')
      }
      // 请求参数
      let params = {
        ckCode: this.form.ckh, // 串口
        btl: this.form.btl, // 波特率
        snlx: 1 // 1：内环、0外环
      }
      if (!this.checkedNh) {
        // 取消使能
        zhuanTaiShiNengCancel(params).then(res => {
          if (res.code !== 0) {
            return this.$message.warning(res.message)
          }
        })
      } else {
        // 使能
        zhuanTaiShiNeng(params).then(res => {
          if (res.code !== 0) {
            return this.$message.warning(res.message)
          }
        })
      }
    },
    /**
     * 外环使能事件
     * @param {*} data
     */
    whsnClick() {
      if (!this.form.ckh || !this.form.btl) {
        return this.$message.warning('请选择串口号、波特率')
      }
      // 请求参数
      let params = {
        ckCode: this.form.ckh, // 串口
        btl: this.form.btl, // 波特率
        snlx: 0 // 1：内环、0外环
      }
      console.log('waihuan:', this.checkedWh)
      if (!this.checkedWh) {
        // 取消使能
        zhuanTaiShiNengCancel(params).then(res => {})
      } else {
        // 使能
        zhuanTaiShiNeng(params).then(res => {})
      }
    },
    /**
     * 转台通讯
     */
    ztConnectClick() {
      if (!this.form.ckh || !this.form.btl) {
        return this.$message.warning('请选择串口号、波特率')
      }
      // 请求参数
      let params = {
        ckCode: this.form.ckh, // 串口
        btl: this.form.btl // 波特率
      }
      if (this.connectState) {
        // 取消通讯
        connectCancel(params).then(res => {
          if (res.code === 0) {
            this.connectState = false
            this.connectName = '通 讯'
            return this.$message.success('取消通讯成功')
          }
        })
      } else {
        // 通讯
        connect(params).then(res => {
          if (res.code === 0) {
            this.connectState = true
            this.connectName = '关闭通讯'
            this.$socket.registerCallBack(this.zhuanTaiScoketConnect)
            console.log(this.zhuanTaiObj)
            if (this.zhuanTaiObj.nhsn === 1) {
              this.checkedNh = true
            } else {
              this.checkedNh = false
            }
            if (this.zhuanTaiObj.whsn === 1) {
              this.checkedWh = true
            } else {
              this.checkedWh = false
            }
            return this.$message.success('通讯成功')
          }
        })
      }
    },
    /**
     * 运行
     * @param {*} val 工作模式指令
     * @param {*} runlx  运行类型：内环1、外环2、全局(自动调平)3、抱闸4、解锁5
     */
    run(val, runlx) {
      if (!this.form.ckh || !this.form.btl) {
        return this.$message.warning('请选择串口号、波特率')
      }
      // 请求参数
      let params = {
        ckCode: this.form.ckh, // 串口
        btl: this.form.btl, // 波特率
        gzms: val, // 运行类型
        nine: runlx // 第九字节（传给后台接口用）
      }
      if (runlx === 1) {
        // 内环1
        // 角度
        params.jd = this.form.nhsn_jd
        // 速度
        params.sd = this.form.nhsn_sd
      } else if (runlx === 2) {
        // 外环2
        // 角度
        params.jd = this.form.whsn_jd
        // 速度
        params.sd = this.form.whsn_sd
      }
      runZhuanTai(params).then(res => {})
    },
    /**
     * 开始保存
     */
    baocunStart() {
      if (!this.setTimeForm.Time) {
        return this.$message.warning('请输入时间')
      }
      this.isStartTime = true
      // 计时秒
      this.timer = setInterval(() => {
        this.timeInterval += 1
        this.timeInterval = Number(this.timeInterval.toFixed(2))
      }, 1000)
      // 点击开始保存按钮清空数组
      this.saveZhuanTaiList = []
      this.saveZhuanTaiTime = []
    },
    /**
     * 停止保存：右下角八个参数
     */
    saveData() {
      // 停止
      this.isStartTime = false
      clearInterval(this.timer)
      this.timeInterval = 0
    },
    /**
     * 获取要保存的数据，保存数据的判断都在这个方法中
     * @param {*} data 当前转台obj
     */
    huoQuShuJu(data) {
      // 判断秒间隔存储数据，根据当前时间秒数跟所输入的秒进行判断
      if (parseInt(this.getNowDate(2)) % parseInt(this.setTimeForm.Time) === 0) {
        let obj = {
          nowData: this.getNowDate(),
          ...data
        }
        // 用一个时间数组来判断当前秒是否已存在，是否需要再次add数组
        if (this.saveZhuanTaiTime.indexOf(obj.nowData) === -1) {
          this.saveZhuanTaiTime.push(obj.nowData)
          this.saveZhuanTaiList.push(obj)
        }
        let objQ1 = {
          nowData: this.getNowDate(),
          q1x: data.q1x,
          q1y: data.q1y
        }
        // 用一个时间数组来判断当前秒是否已存在，是否需要再次add数组
        if (this.saveQ1Time.indexOf(objQ1.nowData) === -1) {
          this.saveQ1Time.push(objQ1.nowData)
          this.saveQ1List.push(objQ1)
        }
      }
    },
    /**
     * 开始保存Q1
     */
    baocunStartQ1() {
      if (!this.setTimeForm.Time) {
        return this.$message.warning('请输入时间')
      }
      this.isStartTimeQ1 = true
      // 计时秒
      this.timerQ1 = setInterval(() => {
        this.timeIntervalQ1 += 1
        this.timeIntervalQ1 = Number(this.timeIntervalQ1.toFixed(2))
      }, 1000)
      // 点击开始保存按钮清空数组
      this.saveQ1List = []
      // 点击开始保存按钮清空数组
      this.saveQ1Time = []
    },
    /**
     * 停止保存Q1
     */
    saveDataQ1() {
      // 停止
      this.isStartTimeQ1 = false
      clearInterval(this.timerQ1)
      this.timeIntervalQ1 = 0
    },
    /**
     * 当前时间
     * @returns  时分秒
     */
    getNowDate(val) {
      var date = new Date()
      var sign2 = ':'
      var year = date.getFullYear() // 年
      var month = date.getMonth() + 1 // 月
      var day = date.getDate() // 日
      var hour = date.getHours() // 时
      var minutes = date.getMinutes() // 分
      var seconds = date.getSeconds() // 秒
      var weekArr = [
        '星期一',
        '星期二',
        '星期三',
        '星期四',
        '星期五',
        '星期六',
        '星期天'
      ]
      var week = weekArr[date.getDay()]
      // 给一位数的数据前面加 “0”
      if (month >= 1 && month <= 9) {
        month = '0' + month
      }
      if (day >= 0 && day <= 9) {
        day = '0' + day
      }
      if (hour >= 0 && hour <= 9) {
        hour = '0' + hour
      }
      if (minutes >= 0 && minutes <= 9) {
        minutes = '0' + minutes
      }
      if (seconds >= 0 && seconds <= 9) {
        seconds = '0' + seconds
      }
      if (val === 1) {
        return year + month + day + hour + sign2 + minutes + sign2 + seconds
      }
      if (val === 2) {
        return seconds
      }
      return hour + sign2 + minutes + sign2 + seconds
    },
    // 雷达图
    initEcharts() {
      let _this = this
      let myChart = echarts.init(_this.$refs.main)
      let option = {
        title: {
          text: '角度曲线',
          textStyle: { color: '#fff' }
        },
        tooltip: {
          trigger: 'axis'
        },
        legend: {
          textStyle: { color: '#fff' },
          data: ['夹角差值', '倾角差X轴', '倾角差Y轴']
        },
        grid: {
          left: '3%',
          right: '4%',
          bottom: '3%',
          containLabel: true
        },
        toolbox: {
          feature: {
            saveAsImage: {}
          }
        },
        xAxis: {
          type: 'category',
          boundaryGap: false,
          data: [
            '1',
            '2',
            '3',
            '4',
            '5',
            '6',
            '7',
            '8',
            '9',
            '10',
            '11',
            '12',
            '13',
            '13',
            '14',
            '15',
            '16',
            '17',
            '18',
            '19',
            '20',
            '21',
            '22',
            '23',
            '24',
            '25',
            '26',
            '27'
          ]
          // data: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '28', '29', '30', '31', '32', '33', '34', '35', '36', '37', '38', '39', '40', '41', '42', '43', '44', '45', '46', '46', '46', '47', '48', '49']
          // data: _this.numArr
        },
        yAxis: {
          type: 'value'
        },
        textStyle: {
          color: 'white'
        },
        series: [
          {
            name: '夹角差值',
            type: 'line',
            itemStyle: {
              normal: {
                color: '#00FF00',
                lineStyle: {
                  color: '#00FF00'
                }
              }
            },
            data: _this.jiaJiaoChaArr
          },
          {
            name: '倾角差Y轴',
            type: 'line',
            itemStyle: {
              normal: {
                color: '#0096f5',
                lineStyle: {
                  color: '#0096f5'
                }
              }
            },
            data: _this.qingJiaoChaYArr
            // data: [0.1138, 0.1138, 0.1138, 0.1138, 0.1138, 0.1138, 0.1138, 0.1138, 0.1138, 0.1139, 0.1139, 0.1139, 0.1139, 0.1139, 0.1139, 0.1139, 0.1139, 0.1139]
          },
          {
            name: '倾角差X轴',
            type: 'line',
            itemStyle: {
              normal: {
                color: '#f73131',
                lineStyle: {
                  color: '#f73131'
                }
              }
            },
            data: this.qingJiaoChaXArr
          }
        ]
      }
      option && myChart.setOption(option)
    }
  }
}
